<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>

<!doctype html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>安城金融图书管理平台</title>
		<link rel="stylesheet" href="${ pageContext.request.contextPath }/css/bootstrap.min.css" type="text/css" />
		<script src="${ pageContext.request.contextPath }/js/jquery-1.11.3.min.js" type="text/javascript"></script>
		<script src="${ pageContext.request.contextPath }/js/bootstrap.min.js" type="text/javascript"></script>
		<!-- 引入自定义css文件 style.css -->
		<link rel="stylesheet" href="${ pageContext.request.contextPath }/css/style.css" type="text/css" />
		<style>
			body {
				margin-top: 20px;
				margin: 0 auto;
			}
			
			.carousel-inner .item img {
				width: 100%;
				height: 300px;
			}
			
			.container .row div {
				/* position:relative;
	 float:left; */
			}
			
			font {
				color: #3164af;
				font-size: 18px;
				font-weight: normal;
				padding: 0 10px;
			}
		</style>
		<script type="text/javascript">
		
		
			function del(pid){
				var flag = confirm("您确定删除我吗?");
				if(flag==true){
					//window.location.href="${ pageContext.request.contextPath }/CartServlet?method=removeCart&pid="+pid;
					window.location.href="${ pageContext.request.contextPath}/BookBorrowServlet?method=removeCart&bookBorrowing_id="+pid;
				}
			}
		</script>
		<script type="text/javascript">
		$(function(){
		
		});
		
		
			function reduce(pid,obj){
				//点击减少操作，只能够把数量降低到1，异步发送请求到CartServlet {"method":"addCart","pid":pid}
				var $count = $(obj).next().text();
				//alert($count);
				if($count !=1){
					//通过异步方式post方法
					$count =$count-1;
				//	alert($count);
					$.post("${pageContext.request.contextPath}/BookBorrowServlet",{"method":"changeCart","count":$count,"ajax":"reduce","bookBorrowing_id":pid}, function(i,n){
						if(n != ""){//有返回数据
							window.location.href="${ pageContext.request.contextPath}/jsp/cartforword.jsp";
						}
					} );
				}else{
					alert("数量为1了，不能在减少了");
				}
				
			}
			
			function plus(pid,ck,obj){
				//点击减少操作，只能够把数量降低到1，异步发送请求到CartServlet {"method":"addCart","pid":pid}
				var $count = $(obj).prev().text();
				//alert($count);
					//通过异步方式post方法
					$count =Number($count)+1;
				//	alert($count);
				if($count>ck){
					alert("库存不足！");
					return;
				}else{
					$.post("${pageContext.request.contextPath}/BookBorrowServlet",{"method":"changeCart","count":$count,"ajax":"plus","bookBorrowing_id":pid}, function(i,n){
						if(n != ""){//有返回数据
							window.location.href="${ pageContext.request.contextPath}/jsp/cartforword.jsp";
						}
					} );
				}
			}
			
		</script>
	</head>

	<body>


		<%@ include file="menu.jsp" %>
		
		
		 <c:if test="${fn:length(pageBean.list) == 0 }">
		 	<div style="margin-left: 30%">
				<h1><span style="color:red">书单空空 </span> </h1>
				<%-- <img src="${ pageContext.request.contextPath }/image/cart.png" width="350" height="350"/> --%>
			</div>
		</c:if>
		<c:if test="${fn:length(pageBean.list) != 0 }">  
		<div class="container">
			<div class="row">

				<div style="margin:0 auto; margin-top:10px;width:100%;">
					<strong style="font-size:16px;margin:5px 0;">图书申请列表</strong>
					<table class="table table-bordered">
						<tbody>
							<tr class="warning">
								<th>图片</th>
								<th>书名</th>
								<th>作者</th>
								<th>数量</th>
								<th>库存</th>
								<th>预计归还日期</th>
								<th>操作</th>
							</tr>
							<c:forEach var="entry" items="${ pageBean.list }">
						
							
							<tr class="active">
								<td width="10%">
									<input type="hidden" name="id" value="22">
									<img src="${ pageContext.request.contextPath }/${ entry.book_image }" width="70" height="60">
								</td>
								<td width="25%">
									<a target="_blank">${ entry.books_name }</a>
								</td>
								<td width="15%">
									${ entry.book_author }
								</td>
								<td width="20%" >
								<span class="glyphicon glyphicon-minus"  onclick="reduce('${entry.bookBorrowing_id}',this)"></span>
								<span id="count">${ entry.total }</span>	
								<span class="glyphicon glyphicon-plus"  onclick="plus('${entry.bookBorrowing_id}','${ entry.inventory }',this)"></span>
								</td>
								<td width="10%">
									<span class="total">${ entry.inventory }</span>
								</td>
								<td width="15%">
									<span class="expeReturnTime">${ entry.expeReturnTime }</span>
								</td>
								<td>
									<a href="#" onclick="del('${entry.bookBorrowing_id}')" class="delete">删除</a>
								</td>
							</tr>
						
							</c:forEach>
						</tbody>
					</table>
				</div>
			</div>
			
			<!--分页 -->
		<div style="width:380px;margin:0 auto;margin-top:50px;">
			<ul class="pagination" style="text-align:center; margin-top:10px;">
				
				<li <c:if test="${ pageBean.currPage == 1 }">class="disabled"</c:if>>
					<a  <c:if test="${ pageBean.currPage == 1 }"> style="pointer-events:none"</c:if>  href="${ pageContext.request.contextPath }/BookBorrowServlet?method=findApplication&currPage=${pageBean.currPage-1}" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a>
				</li>
				
				<c:forEach var="i" begin="1" end="${ pageBean.totalPage }">
					<c:if test="${ pageBean.currPage == i }">
						<li class="active"><a href="#">${ i }</a></li>
					</c:if>
					<c:if test="${ pageBean.currPage != i }">
						<li><a href="${ pageContext.request.contextPath }/BookBorrowServlet?method=findApplication&currPage=${i}">${ i }</a></li>
					</c:if>
					
				</c:forEach>
				
				<li <c:if test="${ pageBean.currPage == pageBean.totalPage }">class='disabled'</c:if>>
					<a  <c:if test="${ pageBean.currPage == pageBean.totalPage }"> style="pointer-events:none"</c:if>  href="${ pageContext.request.contextPath }/BookBorrowServlet?method=findApplication&currPage=${pageBean.currPage+1}" aria-label="Next">
						<span aria-hidden="true">&raquo;</span>
					</a>
				</li>
			</ul>
		</div>
		<!-- 分页结束=======================        -->
			

			<div style="margin-right:130px;">
				<%-- <div style="text-align:right;">
					<em style="color:#ff6600;">
				登录后确认是否享有优惠&nbsp;&nbsp;
			</em> 赠送积分: <em style="color:#ff6600;">${ cart.total }</em>&nbsp; 商品金额: <strong style="color:#ff6600;">￥${ cart.total }元</strong>
				</div> --%>
				<div style="text-align:right;margin-top:10px;margin-bottom:10px;">
					<a href="${ pageContext.request.contextPath }/BookBorrowServlet?method=clearCart" id="clear" class="clear">清空申请</a>
					<a href="${ pageContext.request.contextPath }/BookBorrowItemsServlet?method=saveOrder">
						<input type="button" width="100" value="提交申请" name="submit" border="0" style="background: url('${ pageContext.request.contextPath }/images/register.gif') no-repeat scroll 0 0 rgba(0, 0, 0, 0);
						height:35px;width:100px;color:white;">
					</a>
				</div>
			</div>

		</div>
	 </c:if> 
		

		<%@ include file="under.jsp" %>

	</body>

</html>